<template>
  <div style="max-height: 800px;overflow-y: auto">
    <div v-if="recordList.length > 0"  class="flex-between-center PractiseRecord" v-for="item in recordList" >
      <div class="flex-column">
        <div class="PractiseRecord-title">
          <span>{{'[试卷]'}}</span>
          <span>{{item.bankName}}</span>
        </div>
        <div class="PractiseRecord-content">
          <span>{{item.createTime}}</span>
          <span style="margin-left: 15px">{{'做对 ' + item.correctCount+' / 总数 ' + item.questionCount  }}</span>
        </div>
      </div>
      <div>
        <div class="changes-btn click"   @click="goTrain(item)">查看解析</div>
      </div>
    </div>
    <div v-else style="margin-top: 120px;text-align: center">暂无数据</div>
  </div>

</template>

<script setup>
import {defineProps, getCurrentInstance} from 'vue';
import {useRoute, useRouter} from 'vue-router';
import CourseCurriculumItem from "@/views/component/course-curriculum-item.vue";
import CurriculumItem from "@/views/component/course-curriculum-item.vue";

const { proxy } = getCurrentInstance();
const router = useRouter();
const route = useRoute();
const props = defineProps({
  recordList: {
    type: Array,
    default: []
  }
});
function goTrain(item) {
  let url = 'https://exam.51jhwx.com/#/pages/paper/practice-pc?id=' + item.assoTrainId + '&isHistory=true&type=practice&needLogin=false&needBack=false'
  window.open(url, '_blank')
}
</script>
<style lang="scss">
.PractiseRecord{
  margin-bottom: 10px;
  padding: 20px;
  border-bottom: 1px solid #eee;
  .PractiseRecord-title{
    font-size: 18px;
    font-weight: 400;
    color: #171920;
    line-height: 1;
    margin-bottom: 10px;
  }
  .PractiseRecord-content{
    font-size: 14px;
    font-weight: 400;
    color: #666;
}
}
.PractiseRecord:hover {
  background: #e8f8fc;
}
.changes-btn {
  width: 80px;
  height: 30px;
  border-radius: 15px;
  display: block;
  color: #fff;
  font-size: 14px;
  background: #04addb;
  line-height: 30px;
  text-align: center;
}
.changes-btn:hover {
  background: #039fc9;
}

</style>
